@if (coreConfig.notify?.enable) {
  <div class="notify">
    @if (!(notify$ | async)) {
      <button
        aria-label="show notify"
        mat-icon-button
        [matTooltip]="'当前没有信息'"
        matTooltipPosition="above"
      >
        <app-icon
          [matBadge]="0"
          matBadgeSize="small"
          matBadgeColor="warn"
          [content]="{ svg: 'bell-outline' }"
        />
      </button>
    }
    @if (notify$ | async; as lists) {
      <button aria-label="show notify" mat-icon-button [mat-menu-trigger-for]="menu">
        <app-icon
          [matBadge]="lists.length"
          matBadgeSize="small"
          matBadgeColor="warn"
          [content]="{ svg: 'bell-outline', color: 'primary' }"
        />
      </button>
      <mat-menu #menu="matMenu" [class]="'notify-menu'">
        <mat-list>
          <div mat-subheader>通知</div>
          <mat-divider />
          @for (item of lists; track item) {
            <mat-list-item>
              <app-icon matListItemIcon [content]="item.icon" />
              <div matListItemLine>
                <app-link (click)="onRead(item)" [content]="item.link" />
              </div>
              @if (item.message) {
                <div matListItemLine [innerHTML]="item.message | stripTags"></div>
              }
              @if (item.date) {
                <div matListItemLine>
                  {{ item.date | date: coreConfig.notify?.params?.dateFormat || 'YYYY-MM-dd' }}
                </div>
              }
            </mat-list-item>
          }
        </mat-list>
      </mat-menu>
    }
  </div>
}
